<template>
  <div>
    <!-- 面包屑导航 -->
    <v-bread></v-bread>
    <!-- 按钮 -->
    <el-button type="primary" plain size="small" @click="addDialog"
      >添加</el-button
    >

    <!-- 表格 -->
    <v-list @edit="edit"></v-list>
    <!-- 弹框 -->
    <v-dialog
      :isShow="isShow"
      @cancel="cancel"
      :isAdd="isAdd"
      ref="diainfo"
    ></v-dialog>
  </div>
</template>
<script>
import vList from "./list.vue";
import vDialog from "./dialog.vue";

export default {
  data() {
    return {
      // 弹窗显示隐藏
      isShow: false,
      //编辑状态
      isAdd: true,
    };
  },

  components: {
    vList,
    vDialog,
  },
  methods: {
    //添加打开弹框
    addDialog() {
      //让弹框显示
      this.isShow = true;
      // console.log(1111);
      //告诉弹框你是一个添加
      // this.isAdd = true
    },
    // 子组件修改父弹框设置的状态
    cancel(e) {
      this.isShow = e;
      // console.log(e);
    },
    //编辑打开弹框
    edit(id) {
      this.isShow = true;
      // 编辑状态
      this.isAdd = false;
      // console.log(id);
      // 传递要修改的数据的id
      this.$refs.diainfo.lookup(id);
    },
  },
};
</script>
<style lang="less" scoped>
.el-button--small {
  margin-top: 15px;
  margin-bottom: 15px;
}
</style>